// import { storiesOf } from '@storybook/vue'
import {
  withKnobs,
  // text,
  // number,
  // array
} from '@storybook/addon-knobs'
import { withActions } from '@storybook/addon-actions'
import { withA11y } from '@storybook/addon-a11y'
import StoryRouter from 'storybook-vue-router'
// 这里导入你自己的组件，
import IconSelectModal from './Index.vue'

export default {
  title: 'IconSelectModal',
  decorators: [withA11y, withKnobs, withActions(), StoryRouter()],
  parameters: {
    notes: `
    `,
  },
}

export const asAComponent = () => ({
  components: { IconSelectModal },
  props: {
  },
  data () {
    return {
      icon: '',
      show: false,
    }
  },
  methods: {
    handleSelectIcon () {
      this.show = true
    },
    onSelect (icon) {
      this.icon = icon
      this.show = false
    },
    onClose () {
      this.show = false
    },
  },
  template: `
    <div>
      <a-icon :type="icon"></a-icon>
      <a-button @click="handleSelectIcon">点击选择图标</a-button>
      <IconSelectModal :show="show" @change="onSelect" @close="onClose"></IconSelectModal>
    </div>
  `
})
